﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UserList.aspx.cs" Inherits="User_UserList" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>用户管理</title>
    <link href="../js/jquery-easyui-1.2.6/themes/default/easyui.css" rel="stylesheet"
        type="text/css" />
    <script src="../js/jquery-easyui-1.2.6/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="../js/jquery-easyui-1.2.6/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="../js/jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <link href="../css/wms.css" rel="stylesheet" type="text/css" />
    <link href="../css/icon.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        var grd;
        var dlgEdit;
        var dlgEditForm;

        $(function () {
            grd = $('#userlist').datagrid({
                nowrap: true,
                striped: true,
                remoteSort: false,
                fitColumns: true,
                pageSize: 10,
                url: "User.ashx?action=list",
                frozenColumns: [[
                    { field: 'ck', checkbox: true }
                ]],
                columns: [[
                    { field: 'UserName', title: '用户名', width: 100 },
                    { field: 'RealName', title: '姓名', width: 100 },
                    { field: 'Sex', title: '性别', width: 50 },
                    { field: 'Birthday', title: '出生日期', width: 100 },
                    { field: 'Tel', title: '电话', width: 100 },
                    { field: 'MobilePhone', title: '手机', width: 100 },
                    { field: 'IDCard', title: '身份证', width: 100 },
                    { field: 'RegisterTime', title: '注册日期', width: 100 },
                    { field: 'Operate', title: '操作', width: 70, align: 'center',
                        formatter: function (value, u, index) {
                            var e = '<a onclick="Edit(\'' + u.Id + '\');" title="编辑" iconcls="icon-edit-blue" class="easyui-linkbutton l-btn l-btn-plain" plain="true"><span class="l-btn-left"><span class="l-btn-text"><span class="l-btn-empty icon-edit-blue">&nbsp;</span></span></span></a>';
                            var d = '<a onclick="Delete(\'' + u.Id + '\')" title="删除" iconcls="icon-delete" class="easyui-linkbutton l-btn l-btn-plain" plain="true"><span class="l-btn-left"><span class="l-btn-text"><span class="l-btn-empty icon-delete">&nbsp;</span></span></span></a>';
                            return e + d;
                        }
                    }
                ]],
                pagination: true,
                rownumbers: true,
                toolbar:
                [
                    {
                        id: 'btnAdd',
                        text: '添加',
                        iconCls: 'icon-add-blue',
                        handler: Add
                    },
                    '-',
                    {
                        id: 'btnDelete',
                        text: '批量删除',
                        iconCls: 'icon-delete',
                        handler: function () {
                            var rows = $("#userlist").datagrid("getSelections");

                            if (rows.length == 0) {
                                $.messager.show({
                                    title: '操作提示',
                                    msg: '请选择您要删除的记录！',
                                    showType: 'slide',
                                    timeout: 3000
                                });
                            }
                            else {
                                $.messager.confirm("操作提示", "您确定要删除选中的记录吗？", function (data) {
                                    if (data) {
                                        var idlist = [];

                                        $.each(rows, function (i, row) {
                                            idlist.push(row.Id);
                                        });

                                        $.ajax({
                                            type: "POST",
                                            url: "User.ashx",
                                            data: "action=delete&ID=" + idlist.join(','),
                                            success: function (data) {
                                                eval('data=' + data);
                                                if (data.success) {
                                                    $.messager.alert('操作提示', '删除成功！', "info", function () {
                                                        $('#userlist').datagrid("reload");
                                                    });
                                                }
                                                else {
                                                    $.messager.alert('数据操作异常', data.message, "error");
                                                }
                                            },
                                            error: function () {
                                                $.messager.alert('异步操作异常', '异步操作错误！', "error");
                                            }
                                        });
                                    }
                                });
                            }
                        }
                    }
                ]
            });

            dlgEdit = $("#dlgEditUser").dialog({
                closed: true,
                width: 750,
                height: 400,
                closable: true,
                draggable: true,
                resizable: false,
                modal: true,
                buttons:
                [
                    {
                        text: '保存',
                        iconCls: 'icon-ok',
                        handler: Save
                    },
				    {
				        text: '取消',
				        iconCls: 'icon-cancel',
				        handler: function () {
				            dlgEdit.dialog('close');
				        }
				    }
				],
                onClose: function () {
                    grd.datagrid('clearSelections');
                }
            });

            dlgEditForm = dlgEdit.find('form');
        });

        function prefix(i) {
            if (i < 10) {
                return "0" + i;
            } else {
                return i;
            }
        }
        // 添加
        function Add() {
            var roleID = $("#RoleID").val();
            dlgEdit.dialog('open');
            dlgEdit.form('clear');
            $("#UserName").removeAttr("disabled").focus();
            $("#Sex").val("男");
            $("#RoleID").val(roleID);
            // 初始化注册日期为当天日期
            var today = new Date();
            $("#RegisterTime").val(today.getFullYear() + '-' + prefix(today.getMonth() + 1) + '-' + prefix(today.getDate()));
            // 清空市区
            $("#CityID,#CountyID").html("<option>-请选择-</option>");
            $("#ProvinceID").val("-请选择-");
            $("#CityID").val("-请选择-");
            $("#CountyID").val("-请选择-");
            dlgEditForm.url = 'User.ashx?action=insert';
        }

        // 编辑
        function Edit(id) {
            dlgEdit.dialog('open');
            dlgEditForm.form('load', 'User.ashx?action=read&ID=' + id);
            dlgEditForm.url = 'User.ashx?action=update&ID=' + id;

            $("#UserName").attr("disabled", "disabled")

            // 读取城市、区县
            $.ajax({
                type: "get",
                dataType: "json",
                url: "User.ashx?action=read&ID=" + id,
                success: function (data) {
                    $.ajax({
                        type: "get",
                        dataType: "json",
                        url: "User.ashx?action=city&ProvinceID=" + data.ProvinceID,
                        beforeSend: function () {
                            $("#CityID").empty();
                            $("#CityID").html("<option>数据加载中</option>")
                        },
                        success: function (city) {
                            var CityID = $("#CityID");
                            // 先清空，再添加
                            CityID.html("<option>-请选择-</option>");
                            $.each(city, function (index, item) {
                                CityID.append("<option value='" + item.Id + "'>" + item.CityName + "</option>");
                            });

                            CityID.val(data.CityID)

                            $.ajax({
                                type: "get",
                                dataType: "json",
                                url: "User.ashx?action=county&CityID=" + data.CityID,
                                beforeSend: function () {
                                    $("#CountyID").empty();
                                    $("#CountyID").html("<option>数据加载中</option>")
                                },
                                success: function (county) {
                                    var CountyID = $("#CountyID");
                                    // 先清空，再添加
                                    CountyID.html("<option>-请选择-</option>");
                                    $.each(county, function (index, item) {
                                        CountyID.append("<option value='" + item.Id + "'>" + item.CountyName + "</option>");
                                    });

                                    CountyID.val(data.CountyID)
                                }
                            });
                        }
                    });
                }
            });
        }

        // 删除
        function Delete(id) {
            $.messager.confirm("操作提示", "您确定要删除选中的记录吗？", function (data) {
                if (data) {
                    $.ajax({
                        type: "POST",
                        url: "User.ashx",
                        data: "action=delete&ID=" + id,
                        success: function (data) {
                            eval('data=' + data);
                            if (data.success) {
                                $.messager.alert('操作提示', '删除成功！', "info", function () {
                                    grd.datagrid("reload");
                                });
                            }
                            else {
                                $.messager.alert('操作提示', data.message, "error");
                            }
                        },
                        error: function () {
                            $.messager.alert('异步操作异常', '异步操作错误！', "error");
                        }
                    });
                }
                else {
                    grd.datagrid('clearSelections');
                }
            });
        }

        // 保存
        function Save() {
            if ($("#UserName").val() == "") {
                $.messager.alert("操作提示", "用户名不能为空", "error");
                return;
            }
            if ($("#RealName").val() == "") {
                $.messager.alert("操作提示", "姓名不能为空", "error");
                return;
            }
            if ($("#NumberID").val() == "") {
                $.messager.alert("操作提示", "用户编号不能为空", "error");
                return;
            }
            if ($("#RoleID").val() == "") {
                $.messager.alert("操作提示", "角色不能为空", "error");
                return;
            }
            if ($("#Email").val() != "") {
                var email = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
                if (!email.test($("#Email").val())) {
                    $.messager.alert("操作提示", "E-mail格式错误", "error");
                    return;
                }
            }
            if ($.browser.msie && ($.browser.version == "6.0") && !$.support.style) {
                if (dlgEditForm.url == "User.ashx?action=insert") {
                    $.ajax({
                        type: "POST",
                        url: "User.ashx",
                        data: "action=exists&UserName=" + $("#UserName").val(),
                        success: function (oData) {
                            eval('oData=' + oData);
                            if (oData.success) {
                                $.messager.alert('操作提示', oData.message, "error");
                            }
                            else {
                                dlgEditForm.form('submit', {
                                    url: dlgEditForm.url,
                                    onSubmit: function () {
                                        return $(this).form('validate');
                                    },
                                    success: function (data) {
                                        dlgEdit.dialog('close');
                                        $.messager.alert('操作提示', '保存成功！', "info", function () {
                                            grd.datagrid("reload");
                                        });
                                    }
                                });
                            }
                        },
                        error: function () {
                            $.messager.alert('异步操作异常', '异步操作错误！', "error");
                        }
                    });
                } else {
                    dlgEditForm.form('submit', {
                        url: dlgEditForm.url,
                        onSubmit: function () {
                            return $(this).form('validate');
                        },
                        success: function (data) {
                            dlgEdit.dialog('close');
                            $.messager.alert('操作提示', '保存成功！', "info", function () {
                                grd.datagrid("reload");
                            });
                        }
                    });
                }
            } else {
                dlgEditForm.form('submit', {
                    url: dlgEditForm.url,
                    onSubmit: function () {
                        return $(this).form('validate');
                    },
                    success: function (data) {
                        eval('data=' + data);
                        if (data.success) {
                            $.messager.alert('操作提示', '保存成功！', "info", function () {
                                dlgEdit.dialog('close');
                                grd.datagrid("reload");
                            });
                        }
                        else {
                            $.messager.alert('数据操作异常', data.message, "error");
                        }
                    }
                });
            }
        }

        // 查询
        function Search() {
            grd.datagrid('options').url = 'User.ashx?action=list&UserName=' + encodeURI($("#txtUserName").val()) + '&RealName=' + encodeURI($("#txtRealName").val());
            grd.datagrid("reload");
        }

        // 清空
        function Reset() {
            $("#txtUserName").val("");
            $("#txtRealName").val("");
            grd.datagrid('options').url = 'User.ashx?action=list';
            grd.datagrid("reload");
        }
    </script>
    <script type="text/javascript">
        $(function () {
            // 查询条件
            $("#search").bind("click", function () {
                Search();
            });
            // 清空
            $("#reset").bind("click", function () {
                Reset();
            });
        });
    </script>
    <style type="text/css">
        .combo
        {
            border: none;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            // 省份
            $.ajax({
                type: "get",
                dataType: "json",
                url: "User.ashx?action=province",
                success: function (data) {
                    var ProvinceID = $("#ProvinceID");
                    $.each(data, function (index, item) {
                        ProvinceID.append("<option value='" + item.Id + "'>" + item.ProvinceName + "</option>");
                    });
                }
            });

            // 加载城市
            $("#ProvinceID").bind("change", function () {
                $.ajax({
                    type: "get",
                    dataType: "json",
                    url: "User.ashx?action=city&ProvinceID=" + $("#ProvinceID").val(),
                    beforeSend: function () {
                        $("#CityID").empty();
                        $("#CityID").html("<option>数据加载中</option>")
                    },
                    success: function (data) {
                        $("#CountyID").empty();
                        $("#CountyID").html("<option>-请选择-</option>")
                        var CityID = $("#CityID");
                        // 先清空，再添加
                        CityID.html("<option>-请选择-</option>");
                        $.each(data, function (index, item) {
                            CityID.append("<option value='" + item.Id + "'>" + item.CityName + "</option>");
                        });
                    }
                });
            });

            // 加载区县
            $("#CityID").bind("change", function () {
                $.ajax({
                    type: "get",
                    dataType: "json",
                    url: "User.ashx?action=county&CityID=" + $("#CityID").val(),
                    beforeSend: function () {
                        $("#CountyID").empty();
                        $("#CountyID").html("<option>数据加载中</option>")
                    },
                    success: function (data) {
                        var CountyID = $("#CountyID");
                        // 先清空，再添加
                        CountyID.html("<option>-请选择-</option>");
                        $.each(data, function (index, item) {
                            CountyID.append("<option value='" + item.Id + "'>" + item.CountyName + "</option>");
                        });
                    }
                });
            });

            // 角色
            $.ajax({
                type: "get",
                dataType: "json",
                url: "User.ashx?action=role",
                success: function (data) {
                    var RoleID = $("#RoleID");
                    $.each(data, function (index, item) {
                        RoleID.append("<option value='" + item.Id + "'>" + item.RoleName + "</option>");
                    });
                }
            });

            // 仓库
            $.ajax({
                type: "get",
                dataType: "json",
                url: "User.ashx?action=whs",
                success: function (data) {
                    var RoleID = $("#WhsWhs");
                    $.each(data, function (index, item) {
                        RoleID.append("<option value='" + item.Whs_Whs + "'>" + item.Whs_Whs + "</option>");
                    });
                }
            });
        });
    </script>
    <script src="../js/My97DatePicker/WdatePicker.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#Birthday").bind("click", function () {
                WdatePicker()
            });
        });
    </script>
    <script src="../js/enter2tab.js" type="text/javascript"></script>
</head>
<body>
    <div class="easyui-panel" title="查询条件" iconcls="icon-search" collapsible="true">
        <div class="search-condition">
            用户名：<input id="txtUserName" type="text" />
            姓名：<input id="txtRealName" type="text" />
            <a id="search" class="easyui-linkbutton" plain="true" iconcls="icon-search">查询</a>
            <a id="reset" class="easyui-linkbutton" plain="true" iconcls="icon-empty">清空</a>
        </div>
    </div>
    <div id="userlist" style="margin-top: 5px;">
    </div>
    <div id="dlgEditUser" title="编辑用户" iconcls="icon-add-blue">
        <form method="post">
        <table class="table-dialog">
            <tr>
                <td style="width: 80px;">
                    用户名：
                </td>
                <td>
                    <input id="UserName" name="UserName" type="text" />
                    <span class="required">*</span>
                </td>
                <td>
                    姓名：
                </td>
                <td>
                    <input id="RealName" name="RealName" type="text" />
                    <span class="required">*</span>
                </td>
                <td>
                    性别：
                </td>
                <td>
                    <select id="Sex" name="Sex">
                        <option>男</option>
                        <option>女</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    出生日期:
                </td>
                <td>
                    <input id="Birthday" name="Birthday" type="text" />
                </td>
                <td>
                    电话:
                </td>
                <td>
                    <input id="Tel" name="Tel" type="text" />
                </td>
                <td>
                    手机：
                </td>
                <td>
                    <input id="MobilePhone" name="MobilePhone" type="text" />
                </td>
            </tr>
            <tr>
                <td>
                    角色：
                </td>
                <td>
                    <select id="RoleID" name="RoleID">
                    </select>
                    <span class="required">*</span>
                </td>
                <td>
                    E-mail：
                </td>
                <td>
                    <input id="Email" name="Email" type="text" />
                </td>
                <td>
                    邮编：
                </td>
                <td>
                    <input id="ZipCode" name="ZipCode" type="text" />
                </td>
            </tr>
            <tr>
                <td>
                    所属省市区：
                </td>
                <td colspan="3">
                    <select id="ProvinceID" name="ProvinceID">
                        <option>-请选择-</option>
                    </select>
                    <select id="CityID" name="CityID">
                        <option>-请选择-</option>
                    </select>
                    <select id="CountyID" name="CountyID">
                        <option>-请选择-</option>
                    </select>
                </td>
                <td>
                    默认仓库：
                </td>
                <td>
                    <select id="WhsWhs" name="WhsWhs">
                        <option>-请选择-</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    地址：
                </td>
                <td colspan="5">
                    <input id="Address" name="Address" type="text" style="width: 568px;" />
                </td>
            </tr>
            <tr>
                <td>
                    身份证：
                </td>
                <td colspan="5">
                    <input id="IDCard" name="IDCard" type="text" style="width: 568px;" />
                </td>
            </tr>
            <tr>
                <td>
                    身份证地址：
                </td>
                <td colspan="3">
                    <input id="IDCardAddress" name="IDCardAddress" type="text" style="width: 300px;" />
                </td>
                <td>
                    注册日期：
                </td>
                <td>
                    <input id="RegisterTime" name="RegisterTime" type="text" disabled="disabled" />
                </td>
            </tr>
        </table>
        </form>
    </div>
</body>
</html>
